<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@taglib prefix="shiro" uri="http://shiro.apache.org/tags" %>
<c:set var="ctx" value="${pageContext.request.contextPath}"></c:set>
<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<script src="${ctx}/static/jquery/jquery-2.1.1.min.js" type="text/javascript"></script>
		<script src="${ctx}/static/jquery/jquery-migrate-1.1.1.min.js" type="text/javascript"></script>

		<link href="${ctx}/static/bootstrap/3.3.4/css_default/bootstrap.min.css" type="text/css" rel="stylesheet" />
		<script src="${ctx}/static/bootstrap/3.3.4/js/bootstrap.min.js"  type="text/javascript"></script>
		<link href="${ctx}/static/awesome/4.4/css/font-awesome.min.css" rel="stylesheet" />
		
		<!--datatable-->
		<link rel="stylesheet" href="${ctx}/static/dataTables/css/jquery.dataTables.min.css" />
		<script type="text/javascript" src="${ctx}/static/dataTables/jquery.dataTables.js"></script>
		
		<!--datePicker.js-->
		<script type="text/javascript" src="${ctx}/static/My97DatePicker/WdatePicker.js"></script>
		
		<!--juicer-->
		<script type="text/javascript" src="${ctx}/static/juicer/juicer-min.js"></script>
		
		<script type="text/javascript" src="order.js"></script>
		
		<link rel="stylesheet" href="${ctx}/common/css/style.css" />
		
	</head>
	<body class='orderBody'>
		<div class="container-fluid">
			
			<!--查询条件-->
			<div class="row" style='padding: 30px 0 20px 15px;'>
				<div class='isAdminProvince' style='float:left;margin-right:10px;'>
					<label id='lblSelect'>
						<span style="display: inline-block;">省份</span>
						<select id="selectPointOfInterest" class='provinceSelect' style='width:80px;'>
						  
						</select>
						<script type="text/template" id="provinceSelectTpl">
							  	-~each aaData as item+
							  		<option value="#-item.proviceId+">#-item.proviceName+</option>
							  	-~/each+
						  </script>
					</label>
				</div>
				<div class='isAdminCity' style='float:left;margin-right:10px;'>
					<label id='lblSelect'>
						<span>城市</span>
						<select id="selectPointOfInterest" class='citySelect' style='width:80px;'>
						  
						</select>
						<script type="text/template" id="citySelectTpl">
							  	-~each aaData as item+
							  		<option value="#-item.sysCityId+">#-item.cityName+</option>
							  	-~/each+
						  </script>
					</label>
				</div>
				<div class='isAdminCompany' style='float:left;margin-right:10px;'>
					<label id='lblSelect'>
						<span>公司选择</span>
						<select id="selectPointOfInterest" class='companySelect' style='width:230px;'>
						</select>
						<script type="text/template" id="companySelectTpl">
							  	-~each list as item+
							  		<option value="#-item.organizationId+">#-item.organizationName+</option>
							  	-~/each+
						  </script>
					</label>
				</div>
				<div class='isOtherUserCompany' style='float:left;margin-right:10px;'>
					<label id='lblSelect'>
						<span>公司选择</span>
						<select id="selectPointOfInterest" class='otherUserCompanySelect' style='border-radius:5px;width:230px;'>
						</select>
						<script type="text/template" id="otherUserCompanySelectTpl">
							  	-~each list as item+
							  		<option value="#-item.organizationId+">#-item.organizationName+</option>
							  	-~/each+
						  </script>
					</label>
				</div>
				<div style='float:left;margin-right:10px;'>
					<label id='lblSelect'>
						<span>状态</span>
						<select id="selectPointOfInterest" class='orderStatusSelect' style='width:80px;'>
						  <option value='0'>全部</option>
						  <option value='1'>服务中</option>
						  <option value='2'>已完成</option>
						  <option value='3'>待支付</option>
						  <option value='4'>已取消</option>
						</select>
					</label>
				</div>
				<div class='' style='float:left;margin-right:10px;'>
					<label>
						<input style='display:inline;width: 180px;height:23px;padding:0;' class='form-control searchordername' type='text' placeholder='姓名/手机号' maxlength='11' />
					</label>
				</div>
				<div class='' style='float:left;margin-right:10px;'>
					<label>
						<input style='display:inline;width: 180px;height:23px;padding:0;' class='form-control searchorderaddress' type='text' placeholder='出发地/目的地' maxlength='10' />
					</label>
				</div>
				<div style='float:left;margin-right:10px;'>
					<input type="text" placeholder='下单时间' onfocus="WdatePicker({})" id="datemin" class="input-text Wdate startDate" style="width:120px;padding:0;">
					-
					<input type="text" placeholder='下单时间' onfocus="WdatePicker({})" id="datemax" class="input-text Wdate endDate" style="width:120px;padding:0;">
				</div>
				<div style='float:left;'>
					<shiro:hasPermission name='sys:order:view'>
					<button class="btn search-btn btn-info" style="padding: 0 10px;"><i class='fa fa-search'></i>查询</button>
					</shiro:hasPermission>
					<button class="btn btn-primary" onclick="window.location.reload()" style="padding: 0 10px;"><i class='glyphicon glyphicon-repeat'></i>刷新</button>
				</div>
			</div>
			
			<!--表格-->
			<div class="row">
				<div class="col-md-12">
					<table id="table" class="table table-bordered">
						<thead>
							<tr>
								<th>省份</th>
								<th>所在城市</th>
								<th>公司名称</th>
								<th>姓名</th>
								<th>手机号码</th>
								<th>出发地</th>
								<th>目的地</th>
								<th>下单时间</th>
								<th>订单距离</th>
								<th>订单价格</th>
								<th>类型</th>
								<th>状态</th>
								<th>操作</th>
							</tr>
						</thead>
						<tbody>
			
						</tbody>
					</table>
				</div>
			</div>
			
			
			<!--详情模态框-->
			<div class="modal fade" id="myModalDetail" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
			  <div class="modal-dialog modal-lg">
			    <div class="modal-content">
			      <!-- <div class="modal-header">
			        <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
			        <h4 class="modal-title" id="myModalLabel">订单详情</h4>
			      </div> -->
			      <div class="modal-body">
			      	<button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
			      	<div style=''>
			      	<h4 style='border-bottom: 1px dashed #000;font-weight:bold;'>订单详情</h4>
			      	<div class='row'>
			      		<div class='col-md-4'><div class='col-md-4'>订单号:</div><div class='col-md-8 oid'></div></div>
			      		<div class='col-md-4'><div class='col-md-4'>星级:</div><div class='col-md-8 evaluateLevel'></div></div>
			      		<div class='col-md-4'><div class='col-md-4'>订单取消原因:</div><div class='col-md-8 cancelDesc'></div></div>
			      	</div>
			      	<div class='row'>
			      		<div class='col-md-4'><div class='col-md-4'>结束时间:</div><div class='col-md-8 payTimeStr'></div></div>
			      		<div class='col-md-4'><div class='col-md-4'>订单状态:</div><div class='col-md-8 orderStatus'></div></div>
			      		<div class='col-md-4'><div class='col-md-4'>发单类型:</div><div class='col-md-8 publishType'></div></div>
			      	</div>
			      	<div class='row'>
			      		<div class='col-md-4'><div class='col-md-4'>是否评论:</div><div class='col-md-8 isDispay'></div></div>
			      		<div class='col-md-4'><div class='col-md-4'>取消类型:</div><div class='col-md-8 cancelType'></div></div>
			      		<div class='col-md-4'><div class='col-md-4'>出发条件:</div><div class='col-md-8 setOutCondition'></div></div>
			      	</div>
			      	<div class='row'>
			      		<div class='col-md-4'><div class='col-md-4'>下单用户:</div><div class='col-md-8 placeOrderUserId'></div></div>
			      		<div class='col-md-4'><div class='col-md-4'>评论标签:</div><div class='col-md-8 evaluateLabel'></div></div>
			      		<div class='col-md-4'><div class='col-md-4'>出发时间:</div><div class='col-md-8 setOutTimeStr'></div></div>
			      	</div>
			      	<div class='row'>
			      		<div class='col-md-4'><div class='col-md-4'>订单时长:</div><div class='col-md-8 duration'></div></div>
			      		<div class='col-md-4'><div class='col-md-4'>下单时间:</div><div class='col-md-8 createTimeStr'></div></div>
			      		<div class='col-md-4'><div class='col-md-4'>指派时间:</div><div class='col-md-8 appointTimeStr'></div></div>
			      	</div>
			      	<div class='row'>
			      		<div class='col-md-4'><div class='col-md-4'>评论时间:</div><div class='col-md-8 evaluateDateStr'></div></div>
			      		<div class='col-md-4'><div class='col-md-4'>订单取消时间:</div><div class='col-md-8 cancelTimeStr'></div></div>
			      		<div class='col-md-4'><div class='col-md-4'>乘客手机号:</div><div class='col-md-8 passangerTel'></div></div>
			      	</div>
			      	<div class='row'>
			      		<div class='col-md-4'><div class='col-md-4'>抢单司机:</div><div class='col-md-8 grabOrderUserId'></div></div>
			      		<div class='col-md-4'><div class='col-md-4'>评论内容:</div><div class='col-md-8 evaluateContent'></div></div>
			      		<div class='col-md-4'><div class='col-md-4'>出发类型:</div><div class='col-md-8 setOutType'></div></div>
			      	</div>
			      	<div class='row'>
			      		<div class='col-md-4'><div class='col-md-4'>下单城市:</div><div class='col-md-8 placeOrderCity'></div></div>
			      	</div>
			      	</div>
			      	<div style=''>
			      	<h4 style='border-bottom: 1px dashed #000;font-weight:bold;'>行程信息</h4>
			      	<div class='row'>
			      		<div class='col-md-4'><div class='col-md-4'>起点:</div><div class='col-md-8 startAddress'></div></div>
			      		<div class='col-md-4'><div class='col-md-4'>终点:</div><div class='col-md-8 endAddress'></div></div>
			      		<div class='col-md-4'><div class='col-md-4'>上车纬度:</div><div class='col-md-8 aboardLatitude'></div></div>
			      	</div>
			      	<div class='row'>
			      		<div class='col-md-4'><div class='col-md-4'>上车时间:</div><div class='col-md-8 aboardTime'></div></div>
			      		<div class='col-md-4'><div class='col-md-4'>平台估算距离:</div><div class='col-md-8 estimateDistance'></div></div>
			      		<div class='col-md-4'><div class='col-md-4'>终点经度:</div><div class='col-md-8 endLongitude'></div></div>
			      	</div>
			      	<div class='row'>
			      		<div class='col-md-4'><div class='col-md-4'>起点经度:</div><div class='col-md-8 startLongitude'></div></div>
			      		<div class='col-md-4'><div class='col-md-4'>行程距离:</div><div class='col-md-8 distance'></div></div>
			      		<div class='col-md-4'><div class='col-md-4'>下车经度:</div><div class='col-md-8 debusLongitude'></div></div>
			      	</div>
			      	<div class='row'>
			      		<div class='col-md-4'><div class='col-md-4'>终点纬度:</div><div class='col-md-8 endLatitude'></div></div>
			      		<div class='col-md-4'><div class='col-md-4'>平台估算时长:</div><div class='col-md-8 estimateDuration'></div></div>
			      		<div class='col-md-4'><div class='col-md-4'>车主确认到达时间:</div><div class='col-md-8 endTimeStr'></div></div>
			      	</div>
			      	<div class='row'>
			      		<div class='col-md-4'><div class='col-md-4'>起点纬度:</div><div class='col-md-8 startLatitude'></div></div>
			      		<div class='col-md-4'><div class='col-md-4'>上车经度:</div><div class='col-md-8 aboardLongitude'></div></div>
			      		<div class='col-md-4'><div class='col-md-4'>下车纬度:</div><div class='col-md-8 debusLatitude'></div></div>
			      	</div>
			      	</div>
			      	<div style=''>
			      	<h4 style='border-bottom: 1px dashed #000;font-weight:bold;'>支付信息</h4>
			      	<div class='row'>
			      		<div class='col-md-4'><div class='col-md-4'>订单总金额:</div><div class='col-md-8 totalMoney'></div></div>
			      		<div class='col-md-4'><div class='col-md-4'>订单支付时间:</div><div class='col-md-8 payTimeStr'></div></div>
			      		<div class='col-md-4'><div class='col-md-4'>起步费:</div><div class='col-md-8 startFee'></div></div>
			      	</div>
			      	<div class='row'>
			      		<div class='col-md-4'><div class='col-md-4'>远途费:</div><div class='col-md-8 longFee'></div></div>
			      		<div class='col-md-4'><div class='col-md-4'>叮币支付金额:</div><div class='col-md-8 payMoney'></div></div>
			      		<div class='col-md-4'><div class='col-md-4'>交易类型:</div><div class='col-md-8 transactionType'></div></div>
			      	</div>
			      	<div class='row'>
			      		<div class='col-md-4'><div class='col-md-4'>时长费:</div><div class='col-md-8 durationFee'></div></div>
			      		<div class='col-md-4'><div class='col-md-4'>夜间费用:</div><div class='col-md-8 nightFee'></div></div>
			      		<div class='col-md-4'><div class='col-md-4'>第三方支付金额:</div><div class='col-md-8 alipayMoney'></div></div>
			      	</div>
			      	<div class='row'>
			      		<div class='col-md-4'><div class='col-md-4'>平台估算金额:</div><div class='col-md-8 estimateMoney'></div></div>
			      		<div class='col-md-4'><div class='col-md-4'>里程费:</div><div class='col-md-8 mileageFee'></div></div>
			      		<div class='col-md-4'><div class='col-md-4'>支付类型:</div><div class='col-md-8 payType'></div></div>
			      	</div>
			      	<div class='row'>
			      		<div class='col-md-4'><div class='col-md-4'>最低消费:</div><div class='col-md-8 minimums'></div></div>
			      	</div>
			      	</div>
			      	
			      <div class="modal-footer">
			        <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
			      </div>
			    </div>
			  </div>
			</div>
			

			
		</div>
	
	</body>
</html>
<script type='text/javascript'>
	
	function orderTable(wholeprovinceId,wholecityId,wholecompanyId,orderStatus,timeStart,timeEnd,searchordername,searchorderaddress) {
		
		table = $("#table").DataTable({
			language: {
				"sInfoFiltered": "(共 _MAX_ 页)"
			},
			"pagingType": "simple_numbers",//设置分页控件的模式
		    searching: false,//屏蔽datatales的查询框
		    aLengthMenu:[10],//设置一页展示10条记录
		    "bLengthChange": false,//屏蔽tables的一页展示多少条记录的下拉列表,
		    "processing": true, //打开数据加载时的等待效果
		    "serverSide": true,//打开后台分页
		    "ajax": {
		       "url": ctx+"/order/list", 
		       "type": 'GET',
		       "dataSrc": "aaData",
		    	   "data": {
		    		   proviceId: wholeprovinceId,
		    		   cityId: wholecityId,
		    		   companyId: wholecompanyId,
		    		   orderStatus: orderStatus,
		    		   timeStart: timeStart,
		    		   timeEnd: timeEnd,
		    		   nameOrPhone: searchordername,
		    		   address: searchorderaddress
		    	 } 
		    },
		    "columnDefs": [
				{
					width: '5%',
					targets: -1,
					data: null,
					defaultContent: "<shiro:hasPermission name='sys:order:info'><a class='btn btn-info btn-xs btn-detail m-r-10'><i class='fa fa-search-plus'></i>详情</a></shiro:hasPermission>"
				},
				{targets: 0,data: 'proviceName'},
				{targets: 1,data: 'cityName'},
				{targets: 2,data: 'organizationName'},
				{targets: 3,data: 'trueName'},
				{targets: 4,data: 'telPhone'},
				{targets: 5,data: 'startAddress'},
				{targets: 6,data: 'endAddress'},
				{targets: 7,data: 'createTime'},
				{targets: 8,data: 'distance'},
				{targets: 9,data: 'totalMoney'},
				{targets: 10,data: 'orderType'},
				{targets: 11,data: 'orderStatus',render: function(data) {
					if(data == 1) {
						return "待抢单";
					}
					else if(data == 2) {
						return "服务中";
					}
					else if(data == 3) {
						return "待支付";
					}
					else if(data == 4) {
						return "已完成";
					}
					else if(data == 5) {
						return "已取消";
					}
					else {
						return "暂无状态";
					}
				}}
			]
			
		});
		
		return table;
		
	}
	
</script>